<!DOCTYPE html>
<html lang="en">
<html xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">

    <link rel="shortcut icon" th:href="@{/image/favicon.ico}" type="image/x-icon">
    <link rel="icon" th:href="@{/image/favicon.ico}" type="image/x-icon">

    <link rel="stylesheet" th:href="@{//cdn.bootcss.com/zui/1.10.0/css/zui.min.css}">

    <script th:src="@{//cdn.bootcss.com/zui/1.10.0/lib/jquery/jquery.js}"></script>
    <script th:src="@{//cdn.bootcss.com/zui/1.10.0/js/zui.min.js}"></script>
    <!--      <script src="dist/lib/ieonly/html5shiv.js"></script>&ndash;&gt;-->
    <!--       <script src="dist/lib/ieonly/respond.js"></script>&ndash;&gt;-->
    <!--     <script src="dist/lib/ieonly/excanvas.js"></script>&ndash;&gt;-->
    <title>Niddles 's Blog</title>
</head>
<body>
<div th:insert="import/top::header"></div>

<div class="panel panel-info col-xs-12">
    <div class="panel-heading col-xs-11" >
        优秀文章
    </div>
    <div class="col-xs-1">
        <a class="btn btn-primary"  data-toggle="modal" data-target="#addarticle" data-position="center" data-moveable="true"><i class="icon icon-plus"></i>新增</a>
    </div>
    <div class="panel-body">
        <table class="table table-striped">
            <thead>
            <tr>
                <th>Id</th>
                <th>时间轴<i class="icon icon-time"></i></th>
                <th>文章标题<i class="icon icon-header"></i></th>
                <th>文章摘要<i class="icon icon-tag"></i></th>
                <th>操作<i class="icon icon-wrench"></i></th>
            </tr>
            </thead>
            <tbody>


            <tr th:each="article:${result}">
                <td th:text="${article.id}"></td>
                <td th:text="${#dates.format(article.articlePublicTime, 'yyyy-MM-dd HH:mm')}"></td>
                <td th:text="${article.articleTitle}"></td>
                <td th:text="${article.articleComment}"></td>
                <td>
                    <button onclick="deletearticlebyid()"><i class="icon icon-times"></i>删除</button>
                    <button data-toggle="modal" data-target="#updatearticle" data-position="center" data-moveable="true"><i class="icon icon-underline"></i>修改</button>
                    <button><i class="icon icon-zoom-in"></i>查看</button>
                </td>
            </tr>
            </tbody>
        </table>
    </div>
</div>


<div class="panel panel-success">
    <div class="panel-heading">
        最新文章
    </div>
    <div class="panel-body">
        <table class="table table-striped">
            <thead>
            <tr>
                <th>时间轴<i class="icon icon-time"></i></th>
                <th>文章标题<i class="icon icon-header"></i></th>
                <th>文章分类<i class="icon icon-tag"></i></th>
                <th>操作<i class="icon icon-wrench"></i></th>
            </tr>
            </thead>
            <tbody>
                <td>
                    <button id="deletebyid" onclick="alert('删除成功!')"><i class="icon icon-times"></i>删除</button>
                    <button><i class="icon icon-underline"></i>修改</button>
                </td>
            </tr>
            </tbody>
        </table>
    </div>
</div>
<div style="text-align: center">
    <h3>暂无数据</h3>
</div>
<!-- 新增文章对话框 -->
<div class="modal fade" id="addarticle">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">×</span><span class="sr-only">关闭</span></button>
                <h4 class="modal-title">新增文章</h4>
            </div>
            <div class="modal-body">
                <form action="/article/addarticle" method="post">
                    <div class="form-group">
                        <label for="exampleInputAccount1">标题</label>
                        <input type="text" class="form-control" id="exampleInputAccount1" placeholder="论*的" name="ArticleTitle">
                    </div>
                    <div class="form-group">
                        <label for="exampleInputPassword1">摘要</label>
                        <input type="text" class="form-control" placeholder="" name="ArticleComment">
                    </div>
                    <div class="form-group">
                        <label for="exampleInputPassword1">内容</label>
                        <input type="text" class="form-control"  placeholder="" name="ArticleContent">
                    </div>
                    <div class="form-group">
                        <label for="exampleInputPassword1">时间轴</label>
                        <input type="text" class="form-control" placeholder="" name="ArticlePublicTime">
                    </div>
                    <div class="form-group">
                        <label for="exampleInputPassword1">作者</label>
                        <input type="text" class="form-control"  placeholder="" name="ArticleAuthor">
                    </div>
                    <div class="modal-footer">
                        <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
                        <input type="submit" class="btn btn-primary" value="submit">
                    </div>
                </form>
            </div>
        </div>
    </div>
</div>
<div class="modal fade" id="1">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="form-group">
                <label for="exampleInputPassword1">内容</label>
                <input type="text" class="form-control" id="exampleInputPassword1" placeholder="">
            </div>
        </div>
    </div>
</div>
<div class="modal fade" id="updatearticle">
    <div class="modal-dialog">
        <div class="modal-content">
            <form class="form-horizontal" action="/article/update" method="post">
                <div class="form-group">
                    <label for="exampleInputAccount4" class="col-sm-2">标题</label>
                    <div class="col-md-6 col-sm-10">
                        <input type="text" class="form-control" id="exampleInputAccount4" placeholder="title" name="ArticleTitle">
                    </div>
                </div>
                <div class="form-group">
                    <label for="exampleInputPassword4" class="col-sm-2">摘要</label>
                    <div class="col-md-6 col-sm-10">
                        <input type="text" class="form-control" id="exampleInputPassword4" placeholder="comment" name="ArticleComment">
                    </div>
                </div>
                <div class="form-group">
                    <label for="exampleInputPassword4" class="col-sm-2">时间</label>
                    <div class="col-md-6 col-sm-10">
                        <input type="text" class="form-control" placeholder="time" name="ArticlePublicTime">
                    </div>
                </div>
                <div class="form-group">
                    <label for="exampleInputPassword4" class="col-sm-2">内容</label>
                    <div class="col-md-6 col-sm-10">
                        <input type="text" class="form-control"  placeholder=content name="ArticleContent">
                    </div>
                </div>

                <div class="form-group">
                    <label for="exampleInputPassword4" class="col-sm-2">作者</label>
                    <div class="col-md-6 col-sm-10">
                        <input type="text" class="form-control" placeholder=author name="ArticleAuthor">
                    </div>
                </div>
                <div class="form-group">
                    <div class="col-sm-offset-2 col-sm-10">
                        <button type="submit" class="btn btn-default">修改</button>
                    </div>
                </div>
            </form>
        </div>
    </div>
</div>
<script src="/js/article.js"></script>




<div th:insert="import/bottom::footer"></div>
</body>
</html>